import 'https://cdn.bootcdn.net/ajax/libs/jquery/2.2.0/jquery.js';

class Banner {
    constructor() {
        this.banner = $('.lunbo');
        this.picList = $('.lunbo ul li');
        this.picBtn = $('.lunbo ol li');
        this.leftArrow = $('.left_arrow');
        this.rightArrow = $('.right_arrow');
        this.back = $('.banner');
        this.index = null;
        this.timer = null;
    }

    init() {

        let _this = this;

        this.picBtn.on('click', function() {

            _this.index = $(this).index();
            _this.tabswitch();
        });


        this.rightArrow.on('click', () => {
            this.index++;
            if (this.index > this.picBtn.length - 1) {
                this.index = 0;
            }
            this.tabswitch();
        });

        this.leftArrow.on('click', () => {
            this.index--;
            if (this.index < 0) {
                this.index = this.picBtn.length - 1;
            }
            this.tabswitch();
        });

        // 自动轮播
        this.timer = setInterval(() => {
            this.rightArrow.click();
        }, 3000);


        this.banner.hover(() => {
            clearInterval(this.timer);
        }, () => {
            this.timer = setInterval(() => {
                this.rightArrow.click();
            }, 3000);
        })
    }
    tabswitch() {
        this.picBtn.eq(this.index).addClass('active').siblings().removeClass('active');
        this.picList.eq(this.index).addClass('show').siblings().removeClass('show');
    }
}



export {
    Banner
}